<template>
  <el-dialog title="上级类型" :visible.sync="dialogVisible" :before-close="handleClose" name="dialog">
    <!-- Tree 树形控件 -->
    <el-tree style="overflow: auto;height: 150px" node-key="dictTypeId" :props="defaultProps" @check-change="handleCheckChange" ref="orgTree" :load="loadNode1" lazy show-checkbox></el-tree>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleCheck(false)">取消</el-button>
      <el-button type="primary" @click="handleCheck(true)">确定</el-button>
    </span>
  </el-dialog>
</template>
<script>
import { Tree, Dialog, MessageBox } from 'element-ui'
export default {
  props: ['dialogVisible'],
  data () {
    return {
      // dialogVisible: false, // 弹框是否显示
      defaultProps: {
        label: 'dictTypeName',
        isLeaf: 'isLeaf'
      },
      dictId: '',
      dictParentId: '',
      attrObj: {},
      nowCheckObj: [], // 当前选中的项
      i: 0 // 定义选中tree选中个数
    }
  },
  methods: {
    // 编辑弹框关闭提示框
    handleClose () {
      MessageBox.confirm('确认关闭编辑弹框吗？')
        .then(() => {
          this.$emit('dialogHide', false)
        })
        .catch(() => {})
    },
    // 编辑弹框点击按钮
    handleCheck (result) {
      // this.tableData[this.index] = this.addTabelData
      // result === false(点击了取消)  result === true(点击了确定)
      if (!result) {
        return this.handleClose()
      }
      this.$emit('dialogHide', this.nowCheckObj)
    },
    loadNode1 (node, resolve) {
      if (node.level === 0) {
        this.axios.post('/eosDictType/list').then(res => {
          let parentData = []
          res.data.data.forEach(e => {
            parentData.push(e)
          })
          resolve(parentData)
        }).catch(res => {
          resolve([])
        })
      } else {
        // console.log(' 当前节点id值为：' + node.data.dictTypeId)
        let id = node.data.dictTypeId
        this.axios.get(`/eosDictType/children/${id}`).then(res => {
          let childrenList = []
          res.data.data.forEach(e => {
            childrenList.push(e)
          })
          resolve(childrenList)
        }).catch(res => {
          resolve([])
        })
      }
    },
    handleCheckChange (data, checked, indeterminate) {
      // console.log(data, checked, indeterminate)
      // this.dictId = data.dictTypeId
      // this.dictParentId = data.parentId
      this.nowCheckObj = data
      console.log(this.nowCheckObj)
      // this.$emit('data', data)
      this.i++
      if (this.i % 2 === 0) {
        if (checked) {
          this.$refs.orgTree.setCheckedNodes([])
          this.$refs.orgTree.setCheckedNodes([data])
        // 交叉点击节点
        } else {
          this.$refs.orgTree.setCheckedNodes([])
          // 点击已经选中的节点，置空
        }
      }
    }
  },
  components: {
    'el-tree': Tree, // 树形菜单
    'el-dialog': Dialog // 对话框
  }
}
</script>
